<template>
	<view class="page-appoint">
		<view class="atv">
			<view class="atvsv">
				<view :class="{atc:currentTab==1}" @click="currentTabs(1)">正在审核</view>
			</view>
			<view class="atvsv">
				<view :class="{atc:currentTab==2}" @click="currentTabs(2)">审核完成</view>
			</view>
		</view>
		<view class="fms" v-if="currentTab==1">
			<view class="fm2s"><u-button type="primary" @click="sh(1)" text="确定"></u-button></view>
			<view class="fm2s"><u-button type="error" @click="sh(2)" text="拒绝"></u-button></view>
			<view class="fm2s"><u-button type="info" @click="sh(3)"  text="取消"></u-button></view>
		</view>
		<view class="appoint-item" v-for="(item,index) in list" :key="item.id" :class="{'itvs':cur1==item.id}"
			@click="addxz(item)">
			<view>车牌：{{item.cp}}</view>
			<view>车队：{{item.cdname}}</view>
			<view>货主：{{item.hzname}}</view>
			<view>时间：{{item.times}}</view>
			<view @click="ckimg(item.xszurl)">驾驶证：查看详情</view>
			<view @click="ckimg(item.yyzurl)">行驶证：查看详情</view>
			<view @click="ckimg(item.qturl)">其他：查看详情</view>
			<view v-if="item.status==1">任务状态：待审核</view>
			<view v-if="item.status==2">任务状态：已完成</view>
			<view v-if="item.status==3">任务状态：拒绝</view>
			<view v-if="item.status==3">拒绝理由：{{item.bz}}</view>
		</view>
		<view class="appoint-item" v-if="list.length==0">
			<view>暂无预约数据</view>
		</view>
		<u-popup :show="getimg" mode="center" :closeable="true" round="5" @close="getimg=false" @open="getimg=true">
			<view class="butsj">
				<view class="erimg"><image :src="zjimages"></image></view>
			</view>
		</u-popup>
		<u-popup :show="bztype" mode="center" :closeable="true" round="5" @close="bztype=false" @open="bztype=true">
			<view class="butsj">
				<view class="titles">拒绝理由</view>
				<u--textarea v-model="bz" :height="200" placeholder="请输入拒绝理由" ></u--textarea>
				<view class="fm2s"><u-button type="primary" @click="jujsh()" text="确定"></u-button></view>
				<view class="fm2s"><u-button type="error" @click="bztype=false" text="取消"></u-button></view>
			</view>
		</u-popup>
		<tabBar :pagePath="'/pages/shy/shy'"></tabBar>
		<u-notify ref="uNotify" message="Hi uView"></u-notify>
	</view>
</template>
<script>
	import {
	  request
	} from '@/util/request.js'
	export default {
		data() {
			return {
				udata: '',
				list: [],
				currentTab: 1,
				items4: [],
				current: '',
				sjyuy2: false,
				cp: '',
				cpid: '',
				cdid:'',
				ghcpid: '',
				cpnames: '',
				cur1: '',
				xzinfo: '',
				cur2:'',
				codeimg:'',
				codetypes:false,
				getimg:false,
				zjimages:'',
				bztype:false,
				bz:''
			}
		},
		created() {
			this.getuserinfo()
		},
		methods: {
			
			ckimg(e){
				this.zjimages = e
				this.getimg = true
			},
			async jujsh(){
				let bz = this.bz
				if(bz==null){
					this.$refs.uNotify.show({
						type: 'error',
						message: '请填写拒绝理由！',
						duration: 1000 * 3,
						fontSize: 20,
						safeAreaInsetTop:true
					})
					return false
				}
				let data = {
					id: this.cur1,
					sh: 2,
					bz:this.bz,
				}
				let res = await request('/api/Shy/shenhe/', 'post',data)
				if(res.data.code==200){
					this.bztype = false
					this.$refs.uNotify.show({
						type: 'primary',
						message: '操作完成！',
						duration: 1000 * 3,
						fontSize: 20,
						safeAreaInsetTop:true
					})
					this.init()
				}else{
					this.$refs.uNotify.show({
						type: 'primary',
						message: '操作异常',
						duration: 1000 * 3,
						fontSize: 20,
						safeAreaInsetTop:true
					})
					this.init()
					return false
				}
			},

			async sh(e) {
				if(e!=3){
					if(e==1){
						let data = {
							id: this.cur1,
							sh: e
						}
						let res = await request('/api/Shy/shenhe/', 'post',data)
						if(res.data.code==200){
							this.$refs.uNotify.show({
								type: 'primary',
								message: '操作完成！',
								duration: 1000 * 3,
								fontSize: 20,
								safeAreaInsetTop:true
							})
							this.init()
							return false
						}else{
							this.$refs.uNotify.show({
								type: 'primary',
								message: '操作异常',
								duration: 1000 * 3,
								fontSize: 20,
								safeAreaInsetTop:true
							})
							this.init()
							return false
						}
					}
					if(e==2){
						//拒绝任务
						this.bztype = true
					}
				}else{
					this.cur1 = ''
					this.xzinfo = null
					this.$refs.uNotify.show({
						type: 'primary',
						message: '操作完成',
						duration: 1000 * 3,
						fontSize: 20,
						safeAreaInsetTop:true
					})
					return false
				}
			},
			addxz(e) {
				this.cur1 = e.id
				this.xzinfo = e
			},
			qxcp() {
				this.sjyuy2 = false
			},
			async qxxz(e) {
				if(this.cur1==''){
					uni.showToast({
						title:'请选择后操作',
						icon: "none",
						duration: 2000
					});
					return false;
				}
				
				let data = {
					id: this.cur1,
					cp: this.cp,
					cpid: this.cpid
				}
				let res = await this.$api.edititcpjilu(data)
				if (res.data.code == 0) {
					let data1 = {
						uid:uni.getStorageSync('uid'),
						msg:this.udata.cname+'更换车牌'+this.cp,
						lv:1,
						type:1,
						cz:JSON.stringify(this.xzinfo)
					}	
					await this.$api.addlogs(data1)
					this.init()
					this.sjyuy2 = false
				} else {
					uni.showToast({
						title: res.data.msg,
						icon: "none",
						duration: 2000
					});
				}

			},
			currentTabs(e) {
				this.currentTab = e
				this.init()
			},
			async getuserinfo() {
				let data = {
					id: uni.getStorageSync('uid')
				}
				let res = await this.$api.getuserinfo(data)
				console.log(res.data.code)
				if (res.data.code == 0) {
					this.udata = res.data.data
					this.init()
				}
			},
			async init() {
				let data = {
					uid: uni.getStorageSync('uid'),
					currentTab: this.currentTab
				}
				let res = await request('/api/Shy/gettypelist/', 'post',data)
				this.list = res.data.data
			},
			//取消任务司机
			qxrwsj() {
				let that = this
				uni.showModal({
					cancelText: "取消", // 取消按钮的文字  
					confirmText: "确认", // 确认按钮文字 
					title: '删除提示',
					content: '是否取消当前任务?',
					confirmColor: '#3B8BFF',
					cancelColor: '#222222',
					success: res => {
						//that.delyuy(e);
						if (res.confirm) {
							that.delyuy();
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
						console.log(res)
					}
				});
			},



			async delyuy(e) {
				if(this.xzinfo==''){
					uni.showToast({
						title: '请选择后在进行操作',
						icon: 'none',
						duration: 2000
					});
					return false;
				}
		
					if(this.xzinfo.ygbstatus!=2 && this.xzinfo.status!=1){
						uni.showToast({
							title: '当前任务已经取消',
							icon: 'none',
							duration: 2000
						});
						return false;
					}
				let data = {
					id: this.xzinfo.id,
					currentTab: this.currentTab
				}
				let res = await this.$api.delyuy(data)
				console.log(res.data.data)
				if (res.data.code == 0) {
					let data1 = {
						uid:uni.getStorageSync('uid'),
						msg:this.udata.cname+'取消了任务',
						lv:1,
						type:1,
						cz:JSON.stringify(this.xzinfo)
					}	
					await this.$api.addlogs(data1)
					uni.showToast({
						title: res.data.msg,
						icon: 'none',
						duration: 2000
					});
					this.init()
				} else {
					uni.showToast({
						title: res.data.msg,
						icon: 'none',
						duration: 2000
					});
				}
			},

		}
	}
</script>

<style lang="scss">
	.page-appoint {
		font-size: 14px;
		box-sizing: border-box;
		background-color: #e6e6e6;
		min-height: 610px;
		margin-bottom: 100px;
		padding-bottom: 100px;
	}
	.butsj{
		width: 360px;
		height: 400px;
		overflow: hidden;
		.titles{
			background-color: #3c77b7;
			color: #ffffff;
			text-align: center;
			height: 40px;
			line-height: 40px;
			font-size: 18px;
		}
		.fm2s{
			width: 100px;
			float: left;
			margin-left: 5px;
		}
		.erimg{
			width: 90%;
			height: 300px;
			margin: 0 auto;
			overflow: hidden;
			border: 3px solid #3c77b7;
			border-radius: 10px;
			margin-top: 80upx;
			image{
				height: 100%;
				width: 100%;
			}
		}
	}
	.tcsj{
		width: 360px;
		height: 500px;
	}
	.fms{
		overflow: hidden;
		margin-top: 10px;
		margin: 0 auto;
		.fm2s{
			float: left;
			width: 32%;
			margin-left: 5px;
		}
	}
	.fv {
		float: left;
		border: 3upx solid #007AFF;
		padding: 10upx;
		margin-left: 30upx;
	}

	.atvsv {
		width: 50%;
		float: left;
		// height: 100upx;
		color: #6d6d6d;
		font-size: 18px;
		background-color: #FFFFFF;
	}

	.atc {
		color: #FFFFFF;
		font-size: 15px;
		background-color: #3c77b7;
		height: 100upx;
	}

	.atv {
		width: 100%;
		height: 100upx;
		overflow: hidden;
	}

	.atvsv view {
		display: block;
		line-height: 80upx;
		text-align: center;
		height: 80upx;
		width: 100%;
		// border-radius: 10px;
	}

	.appoint-item {
		display: block;
		width: 96%;
		background-color: #ffffff;
		margin: 0 auto;
		// margin-top: 10px;
		// height: 390upx;
		font-size: 18px;
		border-radius: 5px;
		padding: 40upx;
		position: relative;
		margin-bottom: 10upx;
		margin-top: 5px;
		>view {
			font-size: 18px;
			margin-bottom: 20upx;
		}
	}

	.itevs1 {
		width: 48%;
		height: 50px;
		line-height: 50px;
		text-align: center;
		border: 1px solid #3c77b7;
		float: left;
		margin-left: 5px;
		border-radius: 10px;
		background-color: #3c77b7;
		font-size: 20px;
		font-weight: 600;
		margin-top: 5rpx;
	}

	.itvs {
		background-color: #3c77b7;
		color: #FFFFFF;
	}
	.ck{
		z-index: 999;
		-moz-opacity: 1;
		opacity: 1;
		border: 1px solid #3c77b7;
		position: fixed;
		background-color: #ffffff;
		width: 90%;
		border-radius: 5px;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%);
		//padding: 10upx;
	}
	.qx {
		background-color: #4993dd;
		overflow: hidden;
		color: #ffffff;
		font-size: 40upx;
		height: 40px;
		line-height: 40px;
	}
	.qxtext {
		text-align: center;
		height: 40px;
		line-height: 40px;
		font-size: 20px;
	}
	.wcbd {
		text-align: center;
		height: 70upx;
		line-height: 70upx;
		background-color: #3c77b7;
		font-size: 35upx;
		font-weight: 600;
		color: #ffffff;
	}
	.navlist {
		padding: 10px;
		// margin-bottom: 10px;
		overflow: hidden;
		height: 60px;
	}
	
	.navlistitem1 {
		float: left;
		font-size: 35upx;
		height: 30upx;
	
		// line-height: 30upx;
		font-weight: 600;
		color: #3c77b7;
	}
	
	.navlistitem2 {
		float: left;
		font-size: 35upx;
		height: 60px;
		margin-left: 20upx;
		// line-height: 30upx;
		// font-weight: 600;
		// color: #3c77b7;
	}
	.listv{
		height: 50px;
		width: 80%;
		border: 2px solid #4993dd;
		text-align: center;
		line-height: 50px;
		margin: 0 auto;
		margin-top: 8px;
		border-radius: 10px;
		font-size: 18px;
		color: #4993dd;
		// font-weight: 600;
	}
	.but1{
		float: left;
		margin-left: 20upx;
		height:50px;
		border-bottom: 3px solid #4993dd;
		font-weight: 600;
		width: 300upx;
		line-height: 50px;
		color: #4993dd;
	}
	.seach{
		float: left;
		height: 50px;
		width: 60px;
		color: #ffffff;
		border-radius: 10px;
		font-size: 20px;
		margin-left: 10px;
		line-height: 50px;
		text-align: center;
		background-color: #4993dd;
	}
	.itv{
		background-color: #4993dd;
		color: #ffffff;
	}
	.itv2{
		background-color: #000102;
		color: #ffffff;
	}
</style>
